<template lang="pug">
.hospitalization-notice
  TemplatePreview(
    style="margin: 0px 0;" mode="form",@load="onLoad" iframeId="hospitalizationNotice"
  )
</template>

<script setup lang="ts">
import { useNotify } from "@scmt/common-components";
import { useRequest } from "@scmt/common-hooks";
import { useApi } from "@scmt/core-api";
//@ts-ignore
import TemplatePreview from "../../components/templtePrviews.vue";
import { useUtils } from "@scmt/lib-utils";
const $utils = useUtils();
//添加 Props属性
const props = defineProps({
  selectItem: Object,
});
//定义事件
const emit = defineEmits(["handleQuery"]);

const $notify = useNotify();
const $api = useApi();
const { request, data } = useRequest({
  patient: (patientId: string) => {
    return $api.patient.queryPatientById(patientId);
  },
  templateData: async (typeId: string) =>
    $api.emr.emrTemplate.getEmrTemplateByEmrTypeId(typeId),
  listAsOptions: () => {
    return $api.lis.specimen.category.listAsOptions();
  },
  listDoctorAsOptions: (val: string) =>
    $api.user.listDoctorAsOptions({ officeId: val }),
});
let editor: any = null;
let doc = ref("");
//加载编辑器
const onLoad = (e: any) => {
  editor = e.target.contentWindow.editor;
  request("templateData", {
    params: "cb2bd1b5b6552fc31faba632e7cd7a59",
    onSuccess: (res) => {
      if (res) {
        doc.value = res.content;
        if (editor) {
          let option = {
            // doc: doc.value,
            toolbar: {
              //隐藏工具栏 ：toolbar: false
              file: true, //显示文件
              edit: true, //显示编辑
              insert: true, //显示插入
              expression: true, //显示表达式
              table: true, //显示表格
              revision: true, //显示修订
              view: true, //显示查看
              print: true, //显示打印
              import: true, //显示导入
              export: true, //显示导出
              develop: true, //显示开发工具
              help: true, //显示帮助
            },
            statusbar: true, //是否显示状态栏
            showPageLine: true, //是否显示分页线
            fitWidth: false, //是否适应宽度
            disableCommand: ["template", "save"], //屏蔽文档命令，同时隐藏命令对应工具栏按钮
          };
          //编辑器初始化
          editor.init(option).then(() => {
            //加载html
            editor.loadHtml(doc.value);
            init();
          });
        }
      } else {
        $notify.error("查询模板失败！！");
      }
    },
  });
};

const init = () => {
  if (props.selectItem && props.selectItem.id) {
    let item = Object.assign({}, props.selectItem);
    const list = [
      {
        name: "姓名",
        specimenNumber: "标本号",
        specimen: "标本",
        applicationProject: "医嘱名称",
      },
    ];
    if (item.data) {
      for (let i = 0; i < item.data.length; i++) {
        list.push({
          name: item.data[i].patientName,
          specimenNumber: item.data[i].specimenNumber,
          specimen: data.listAsOptions?.find(
            (z) => z.value == item.data[i].specimenTypeId
          )?.label,
          applicationProject: item.data[i].applicationProject,
        });
      }
      if (editor.$("#list") && editor.$("#list").length > 0) {
        editor.bindDataList("list", list);
      }
    }
    if (editor) {
      editor.setBindObject(item);
      editor.execCommand("print");
    }
  }
};

//监听登记单选择改变
watch(
  () => props.selectItem,
  (item) => {
    if (item && item.id) {
      nextTick(() => {
        request("listAsOptions");
        request("listDoctorAsOptions", "");
        init();
      });
    }
  },
  {
    immediate: true,
  }
);
</script>

<style lang="less" scoped>
.hospitalization-notice {
  height: 0px;
}
</style>
